<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>数组语法绑定 HTML Class</title>

    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.0"></script>
</head>

<body>
    <div id="app">
        <div v-bind:class="[activeClass, errorClass]">
            1、数组绑定 Class
        </div>

        <div v-bind:class="[{ active: isActive }, errorClass]">
            2、数组绑定 Class
        </div>
    </div>
</body>

<script type="text/javascript">
    var app = new Vue({
        el: "#app",
        data: {
            isActive: true,
            activeClass: 'active',
            errorClass: 'text-danger'
        }
    })
</script>

</html>